<template>
  <div class="the-fault-list-style">
    <div class="component-inner-div">
      <!-- 四角样式 -->
      <div class="the-four-border the-four-border-01" />
      <div class="the-four-border the-four-border-02" />
      <div class="the-four-border the-four-border-03" />
      <div class="the-four-border the-four-border-04" />
      <!-- 四角样式 -->

      <!-- 标题栏 -->
      <div class="title">
        <div class="point-icon" />
        <span>故障列表</span>
      </div>
      <!-- 标题栏 -->
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {

    };
  }
};
</script>

<style lang="scss" scoped>
.the-fault-list-style {
  color: white;
  width: 470px;
  // height: 592px;
  box-sizing: border-box;
  .component-inner-div {
    border: 2px solid #122a57;
    height: 100%;
    background-color: rgba($color: #0b1945, $alpha: 0.33);
    box-sizing: border-box;
    .title {
      font-size: 20px;
      padding: 0;
      height: 70px;
      align-items: center;
      display: flex;
      .point-icon {
        background-color: white;
        height: 10px;
        width: 10px;
        margin: 0 10px 0 17px;
      }
    }
  }
}
</style>
